<template>
    <div>
        <div style="margin: 20px 5px 10px 5px;padding: 5px;">
            <el-button type="success" icon="el-icon-plus" @click="openWindow('schoolChild')">新增</el-button>
        </div>
        <div style="margin: 5px;padding: 5px;">
            <el-table :header-cell-style="{background:'#67C23A',color:'white',fontSize:'15px'}" :data="data" size="mini" stripe border :height="500" v-loading="loading">
                <el-table-column type="index" width="80px" label="序号" align="center"></el-table-column>
                <el-table-column prop="name" label="名称" align="center"></el-table-column>
                <el-table-column prop="sortNumber" label="排序" align="center"></el-table-column>
            </el-table>
            <el-pagination background
                           layout="total,prev,pager,next"
                           :total="params.total"
                           :page-size="params.size"
                           :current-page="params.page"
                           :hide-on-single-page="false"
                           @size-change="handleSizeChange"
                           @current-change="handlePageChange"></el-pagination>
        </div>
        <school-child ref="schoolChild"></school-child>
    </div>
</template>

<script>

    import { getList } from "@/api/academic/school";

    export default {
        name: "school-index",
        components:{
            SchoolChild:()=>import("@/views/academic/school-child.vue")
        },
        data(){
            return {
                loading:true,
                params:{page:1,size:10,total:0},
                data:[]
            }
        },
        methods:{
            handleSizeChange(size){
                this.params.size = size;
                this.getList(this.params);
            },
            handlePageChange(page){
                this.params.page = page;
                this.getList(this.params);
            },
            getList(data){
                getList(data).then(res=>{
                    this.data = res.data.data.rows;
                    this.params.total = res.data.data.total;
                    this.loading = false;
                })
            },
            openWindow(name){
                this.$refs[name].data = {};
                this.$refs[name].value = true;
            }
        },
        created(){
            this.getList(this.params);
        }
    }
</script>

<style scoped>

</style>